﻿<!doctype html>
<html class="no-js" lang="en">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="author" content=""/>
<!-- Document Title -->
<title>NewsTime - Blogger HTML5 Template</title>

<!-- StyleSheets -->
<link rel="stylesheet" href="css/bootstrap/bootstrap.min.css">
<link rel="stylesheet" href="css/plugin.css">
<link rel="stylesheet" href="css/animate.css">
<link rel="stylesheet" href="css/transition.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/color-1.css">
<link rel="stylesheet" href="css/responsive.css">
<link rel="stylesheet" href="css/font-awesome.min.css">

<!-- Switcher CSS -->
<link href="./switcher/switcher.css" rel="stylesheet" type="text/css"/> 
<link rel="stylesheet" id="skins" href="./css/color-1.css" type="text/css" media="all">

<!-- FontsOnline -->
<link href='https://fonts.googleapis.com/css?family=Roboto' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Fira+Sans:400,300italic,300,400italic,500,500italic,700,700italic' rel='stylesheet' type='text/css'>


<!-- JavaScripts -->
<script src="js/modernizr.js"></script>
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>

<!-- Preloader -->
<div id="preloader">
    <div id="status">
        <div id="container">
            <div class="loader">
                <div class="loader-inner pacman">
                  <div></div>
                  <div></div>
                  <div></div>
                  <div></div>
                  <div></div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Preloader -->

<!-- Wrapper -->
<div class="wrap push">

	<!-- Header -->
    <div class="header-wrap">

        <!-- Top Bar -->
        <div class="top-bar">
            <div class="container">
                <div class="row">

                    <!-- Top Left Nav -->
                    <div class="col-sm-6 col-xs-6">
                        <ul class="top-left">
                            <li><i class="fa fa-phone"></i>+84 868.8568</li>     
                            <li><i class="fa fa-envelope-o"></i>support@example.com</li>
                        </ul>
                    </div>
                    <!-- Top Left Nav -->

                    <!-- Top Right Nav -->
                    <div class="col-sm-6 col-xs-6 r-full-width">
                        <ul class="top-right text-right">
                            <li class="md-trigger" data-modal="login-popup"><a href="#"><i class="fa fa-key">
                            </i>login</a></li>
                            <li class="md-trigger" data-modal="register-popup"><a href="#"><i class="fa fa-user"></i>register</a></li>
                            
                            <!-- cart dropdown --> 
                            <li class="cart dropdown">
                                <a href="#" class="dropdown-toggle btn-cart" data-toggle="dropdown">
                                <i class="fa fa-shopping-cart"></i><span>2</span></a>

                                <!-- dropdown -->
                                <div class="dropdown-menu cart-item"> 
                                    <h3>Recently added item(s)</h3>
                                    <ul class="cart-list">
                                        <!-- product -->
                                        <li>
                                            <div class="cart-product-item">
                                                <div class="product-img">
                                                    <img src="images/cart-1.jpg" alt="image description">
                                                </div>
                                                <div class="detail">
                                                    <span class="product-title">Pearl Izumi Men's E:Motion Tri N1 Neutral Race Shoe</span>
                                                    <span class="price">1 x $124.99</span>
                                                </div>
                                                <a class="btn-delete-item">
                                                    <i class="fa fa-times"></i>
                                                </a>
                                            </div>
                                        </li>
                                        <!-- product -->

                                        <!-- product -->
                                        <li>
                                            <div class="cart-product-item">
                                                <div class="product-img">
                                                    <img src="images/cart-2.jpg" alt="image description">
                                                </div>
                                                <div class="detail">
                                                    <span class="product-title">Pearl Izumi Men's E:Motion Tri N1 Neutral Race Shoe</span>
                                                    <span class="price">1 x $124.99</span>
                                                </div>
                                                <a class="btn-delete-item">
                                                    <i class="fa fa-times"></i>
                                                </a>
                                            </div>
                                        </li>
                                        <!-- product -->

                                        <!-- product -->
                                        <li>
                                            <div class="cart-product-item">
                                                <div class="product-img">
                                                    <img src="images/cart-3.jpg" alt="image description">
                                                </div>
                                                <div class="detail">
                                                    <span class="product-title">Pearl Izumi Men's E:Motion Tri N1 Neutral Race Shoe</span>
                                                    <span class="price">1 x $124.99</span>
                                                </div>
                                                <a class="btn-delete-item">
                                                    <i class="fa fa-times"></i>
                                                </a>
                                            </div>
                                        </li>
                                        <!-- product -->
                                    </ul>
                                    <div class="btn-area">
                                        <a href="#" class="btn btn-viewall pull-left red">View All</a>
                                        <a href="#" class="btn btn-checkout pull-right red">Checkout</a>
                                    </div>
                                </div>
                                <!-- dropdown -->

                            </li>
                            <!-- cart dropdown -->

                        </ul>
                    </div>
                    <!-- Top Right Nav -->

                </div>
            </div>
        </div>
        <!-- Top Bar -->

        <!-- Navigation Holder -->
        <header class="header">
            <div class="container">
                <div class="nav-holder">

                    <!-- Logo Holder -->
                    <div class="logo-holder">
                        <a href="index.html" class="inner-logo"></a>
                    </div>
                    <!-- Logo Holder -->

                    <!-- Navigation -->
                    <div class="cr-navigation">

						<!-- Navbar -->
                         <nav class="cr-nav">
                            <ul>
                                <li>
                                    <a href="index.html">home</a>
                                    <ul>
                                       <li><a href="index-2.html">Home 2</a></li> 
                                       <li><a href="index-3.html">Home 3</a></li> 
                                    </ul>
                                </li>
                                <li>
                                    <a href="#">categories</a>
                                    <ul>
                                       <li><a href="listing-page-1.html">fashion</a></li> 
                                       <li><a href="listing-page-2.html">sports</a></li> 
                                       <li><a href="listing-page-3.html">world</a></li> 
                                       <li><a href="listing-page-4.html">lifestyle</a></li> 
                                       <li><a href="listing-page-5.html">technology</a></li> 
                                       <li><a href="listing-page-6.html">health</a></li> 
                                       <li><a href="listing-page-7.html">MISC</a></li> 
                                    </ul>
                                </li>
                                <li>
                                    <a href="#">post</a>
                                    <ul>
                                       <li><a href="video-post.html">video post</a></li> 
                                       <li><a href="slider-post.html">slider post</a></li> 
                                       <li><a href="post-detail.html">post detail</a></li> 
                                       <li><a href="post-detail-full-width.html">post detail full width</a></li> 
                                    </ul>
                                </li>
                                <li>
                                    <a href="#">shop</a>
                                    <ul>
                                       <li><a href="products.html">products</a></li> 
                                       <li><a href="products-detail.html">products detail</a></li> 
                                    </ul>
                                </li>
                                <li>
                                    <a href="#">contact</a>
                                    <ul>
                                       <li><a href="contact.html">contact 1</a></li> 
                                       <li><a href="contact-2.html">contact 2</a></li> 
                                       <li><a href="contact-3.html">contact 3</a></li> 
                                    </ul>
                                </li>
                                <li>
                                    <a href="#">404</a>
                                     <ul>
                                       <li><a href="error-404-1.html">404 style 1</a></li> 
                                       <li><a href="error-404-2.html">404 style 2</a></li> 
                                    </ul>
                                </li>
                                <li>
                                    <a href="#">pages</a>
                                    <ul>
                                       <li><a href="faq.html">faq</a></li> 
                                       <li><a href="comming-soon.html">comming soon</a></li> 
                                    </ul>
                                </li>
                            </ul>
                        </nav>
						<!-- Navbar -->

                        <!-- Secondry Nav -->
                        <ul class="cr-add-nav">
                            <li><a href="#" class="fa fa-search md-trigger" data-modal="search-popup"></a></li>
                            <li><a href="#menu" class="menu-link"><i class="fa fa-bars"></i></a></li>
                        </ul>
                        <!-- Secondry Nav -->

                    </div>
                    <!-- Navigation -->

                </div>
            </div>
        </header>
        <!-- Navigation Holder -->

    </div>
    <!-- Header -->

    <!-- Inner Bnner -->
    <section class="banner-parallax overlay-dark" data-image-src="images/inner-banner.jpg" data-parallax="scroll"> 
        <div class="inner-banner">
            <h3>product detail</h3>
            <ul class="tm-breadcrum">
                <li><a href="#">Home</a></li>
                <li>product detail</li>
            </ul>
        </div>
    </section>
    <!-- Inner Bnner -->

    <!-- News Headline Container -->
    <div class="news-bar white-bg">
        <div class="container">
            <div class="row">

                <!-- news -->
                <div class="col-lg-6 col-md-6 col-sm-6 col-xs-9 r-full-width">
                    <div class="headline-wrap">

                        <span class="badge">just in</span>

                        <!-- news ticker -->
                        <div id="ticker">
                            <div class="clip">
                                <div class="today">
                                    <ul>
                                        <li>Source: Manziel 'hung over' at Browns' meeting Clippers suspend Griffin four games.</li>
                                        <li> "Human &amp; Rights” has been helping the and surviving family Rights” know when  has been.</li>
                                        <li>Source: Manziel 'hung over' at Browns' meeting Clippers suspend Griffin four games.</li>
                                        <li>Source: Manziel 'hung over' at Browns' meeting Clippers suspend Griffin four games.</li>
                                    </ul>
                                </div>
                              </div>
                        </div>
                        <!-- news ticker -->

                        <!-- ticker spinner -->
                        <div class="alert-spinner">
                            <div class="double-bounce1"></div>
                            <div class="double-bounce2"></div>
                        </div>
                        <!-- ticker spinner -->

                    </div>
                </div>
                <!-- news -->

                <!-- time clock -->
                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-3 r-full-width">  
                    <div class="time-clock">                  
                        <div id="clock"></div>
                    </div>
                </div>
                <!-- time clock -->

                <!-- Wheather forecast -->
                <div class="col-lg-4 col-md-4 col-sm-4 hidden-xs">
                    <div class="weather-holder">
                        <img src="images/cloud.png" alt="">
                        <span class="weather-state">Cloudy USA, Natha</span>
                        <span class="temp"><i class="fa fa-plus"></i> 18<sup>0</sup> C</span>
                    </div>
                </div>
                <!-- Wheather forecast -->
                
            </div>
        </div>
    </div>
    <!-- News Headline Container -->


    <!-- Main Content -->
    <main class="main-wrap"> 
        <div class="theme-padding">
            <div class="container">
                <div class="row">

                    <div class="col-md-9 col-sm-8">
                        <div class="content">
                            <div class="post-widget p-30 light-shadow white-bg">

                                <div class="row">
                                    <div class="col-md-6">
                                        <!-- product info -->
                                        <div class="product-slider" id="product-slider">
                                            
                                            <!-- Slides -->
                                            <ul id="product-slides" class="product-slides">
                                                <li><img src="images/shop/slides/img-01.jpg" alt=""/></li>
                                                <li><img src="images/shop/slides/img-02.jpg" alt=""/></li>
                                                <li><img src="images/shop/slides/img-03.jpg" alt=""/></li>
                                                <li><img src="images/shop/slides/img-04.jpg" alt=""/></li>
                                                <li><img src="images/shop/slides/img-05.jpg" alt=""/></li>
                                            </ul>   
                                            <!-- Slides -->

                                            <!-- thumbanil navigation -->
                                            <div id="product-thumbnail" class="product-thumbnail">
                                                <a data-slide-index="0" href="#"><img src="images/shop/thumbs/img-01.jpg" alt="" /></a>
                                                <a data-slide-index="1" href="#"><img src="images/shop/thumbs/img-02.jpg" alt="" /></a>
                                                <a data-slide-index="2" href="#"><img src="images/shop/thumbs/img-03.jpg" alt="" /></a>
                                                <a data-slide-index="3" href="#"><img src="images/shop/thumbs/img-04.jpg" alt="" /></a>
                                                <a data-slide-index="4" href="#"><img src="images/shop/thumbs/img-05.jpg" alt="" /></a>
                                            </div>
                                            <!-- thumbanil navigation -->

                                        </div>
                                       <!-- product info -->
                                    </div>

                                    <div class="col-md-6">
                                        <!-- product information -->
                                        <div class="product-info-holder">
                                            <h3>child fashion clothes</h3>

                                            <!-- reviews -->
                                            <ul class="reviews">
                                                <li><i class="fa fa-star"></i></li>
                                                <li><i class="fa fa-star"></i></li>
                                                <li><i class="fa fa-star"></i></li>
                                                <li><i class="fa fa-star"></i></li>
                                                <li><i class="fa fa-star-o"></i></li>
                                                <li><span>(2 reviews)</span></li>
                                            </ul>
                                            <!-- reviews -->

                                            <div class="availbility"><strong>Availbility:</strong> <span> in stock <i class="fa fa-check"></i> </span></div>
                                            <div class="price style-2">$12.00<del>$16.00</del></div>
                                            <p>Porta aliquam vehicula a ullamcorper scelerisque mi fringilla interdum, class dui senectus nec litora tortor praesent justo nostra senectus litora himenaeos.vivamus tellus, dui ut felis conubia risus quisque turpis ad.vehicula nostra auctor urna odio.</p>

                                            <div class="quantity-addwish">
                                                <!-- quantity --> 
                                                <div class="quantity">
                                                    <input type="text" value="1" title="Qty" class="qty" size="4"/>
                                                </div>
                                                <!-- quantity -->
                                                <a class="btn red" href="#"><i class="fa fa-shopping-cart"></i>Add to Cart</a>
                                                <a class="btn red" href="#"><i class="fa fa-heart"></i></a>
                                            </div>

                                        </div>
                                        <!-- product information -->
                                    
                                    </div>
                                </div>

                            </div>

                            <!-- review tabs -->
                            <div class="review-tabs-holder post-widget light-shadow p-30 white-bg" >
                                <div class="horizontal-tabs-widget reviews-tabs">

                                    <!-- tabs navs -->
                                    <ul class="theme-tab-navs">
                                        <li class="active">
                                            <a href="#week" data-toggle="tab">description</a>
                                        </li>

                                        <li>
                                            <a href="#month" data-toggle="tab">reviews(0)</a>
                                        </li>
                                        <li>
                                            <a href="#all" data-toggle="tab">delievry &amp; returns</a>
                                        </li>
                                    </ul>
                                    <!-- tabs navs -->
          
                                    <!-- Tab panes -->
                                    <div class="horizontal-tab-content tab-content">
                                        <div class="tab-pane fade active in" id="week">
                                            <p>Lorem ipsum dolor sit amet isse potenti sesquam ante aliquet lacusemper elit. Cras neque nulla convallis non comodo  sit amet isse potenti sesquam ante aliquet lacusemper elit. Cras neque nulla convallis non comodo.</p>
                                            <ul>
                                                <li>Soft-touch jersey</li>
                                                <li>Crew neck</li>
                                                <li>Logo print</li>
                                                <li>Regular fit - true to size</li>
                                                <li>Machine wash</li>
                                                <li>100% Cotton</li>
                                                <li>size Medium and is 185.5cm/6'1" tall</li>
                                            </ul>
                                
                                        </div>

                                        <div class="tab-pane fade" id="month">
                                            <div class="reviews-product">
                                                <span>there is no reviews yet</span>
                                                <h3>be the first one to review</h3>
                                                <ul class="reviews">
                                                    <li><i class="fa fa-star-o"></i></li>
                                                    <li><i class="fa fa-star-o"></i></li>
                                                    <li><i class="fa fa-star-o"></i></li>
                                                    <li><i class="fa fa-star-o"></i></li>
                                                    <li><i class="fa fa-star-o"></i></li>
                                                </ul>
                                                <form>
                                                    <div class="form-group">
                                                        <textarea rows="4" placeholder="Your review goes here" class="form-control"></textarea>
                                                    </div>
                                                    <div class="form-group">
                                                        <input type="text" class="form-control" placeholder="Your name" />
                                                    </div>
                                                    <div class="form-group">
                                                        <input type="text" class="form-control" placeholder="Your Email address" />
                                                    </div>
                                                    <a href="#" class="btn green">submit</a>
                                                </form>
                                            </div>
                                        </div>

                                        <div class="tab-pane fade" id="all">
                                           <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
                                           tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
                                           quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
                                           consequat.</p>
                                            <ul>
                                                <li>Lorem ipsum dolor sit amet</li>
                                                <li>Lorem ipsum dolor sit amet</li>
                                                <li>Lorem ipsum dolor sit amet</li>
                                                <li>Lorem ipsum dolor sit amet</li>
                                                <li>Lorem ipsum dolor sit amet</li>
                                            </ul>
                                        </div>
                                    </div>
                                    <!-- Tab panes -->
                                </div>
                            </div>
                            <!-- review tabs -->

                            <!-- Slider Widget -->
                <div class="post-widget">

                    <!-- Heading -->
                    <div class="primary-heading">
                        <h2>related posts</h2>
                    </div>
                    <!-- Heading -->

                    <!-- post slider -->
                    <div class="light-shadow gray-bg p-30 slider-post"> 
                        <div id="post-slider-2">

                        <!-- post -->
                        <div class="post style-1">

                            <!-- post img -->
                            <div class="post-thumb"> 
                                <img src="images/post-1/img-01.jpg" alt="">
                                <span class="post-badge">post</span>
                                <div class="thumb-hover">
                                    <div class="position-center-center">
                                        <a href="#" class="fa fa-link"></a>
                                    </div>
                                </div>
                            </div>
                            <!-- post img -->

                            <!-- post detail -->
                            <div class="post-content">
                                <h4><a href="post-detail.html">Full Responsive amazing design And Pixel Perfect </a></h4>
                                <ul class="post-meta m-0">
                                    <li><i class="fa fa-user"></i>jessica alex</li>
                                    <li><i class="fa fa-clock-o"></i>25 dec, 2016</li>
                                    <li><i class="fa fa-thumbs-o-up"></i>20</li>
                                </ul>
                            </div>
                            <!-- post detail -->

                        </div>
                        <!-- post -->

                         <!-- post -->
                        <div class="post style-1">

                            <!-- post img -->
                            <div class="post-thumb"> 
                                <img src="images/post-1/img-02.jpg" alt="">
                                <span class="post-badge">post</span>
                                <div class="thumb-hover">
                                    <div class="position-center-center">
                                        <a href="#" class="fa fa-link"></a>
                                    </div>
                                </div>
                            </div>
                            <!-- post img -->

                            <!-- post detail -->
                            <div class="post-content">
                                <h4><a href="post-detail.html">Full Responsive amazing design And Pixel Perfect </a></h4>
                                <ul class="post-meta m-0">
                                    <li><i class="fa fa-user"></i>jessica alex</li>
                                    <li><i class="fa fa-clock-o"></i>25 dec, 2016</li>
                                    <li><i class="fa fa-thumbs-o-up"></i>20</li>
                                </ul>
                            </div>
                            <!-- post detail -->

                        </div>
                        <!-- post -->

                         <!-- post -->
                        <div class="post style-1">

                            <!-- post img -->
                            <div class="post-thumb"> 
                                <img src="images/post-1/img-03.jpg" alt="">
                                <span class="post-badge">post</span>
                                <div class="thumb-hover">
                                    <div class="position-center-center">
                                        <a href="#" class="fa fa-link"></a>
                                    </div>
                                </div>
                            </div>
                            <!-- post img -->

                            <!-- post detail -->
                            <div class="post-content">
                                <h4><a href="post-detail.html">Full Responsive amazing design And Pixel Perfect </a></h4>
                                <ul class="post-meta m-0">
                                    <li><i class="fa fa-user"></i>jessica alex</li>
                                    <li><i class="fa fa-clock-o"></i>25 dec, 2016</li>
                                    <li><i class="fa fa-thumbs-o-up"></i>20</li>
                                </ul>
                            </div>
                            <!-- post detail -->

                        </div>
                        <!-- post -->

                         <!-- post -->
                        <div class="post style-1">

                            <!-- post img -->
                            <div class="post-thumb"> 
                                <img src="images/post-1/img-04.jpg" alt="">
                                <span class="post-badge">post</span>
                                <div class="thumb-hover">
                                    <div class="position-center-center">
                                        <a href="#" class="fa fa-link"></a>
                                    </div>
                                </div>
                            </div>
                            <!-- post img -->

                            <!-- post detail -->
                            <div class="post-content">
                                <h4><a href="post-detail.html">Full Responsive amazing design And Pixel Perfect </a></h4>
                                <ul class="post-meta m-0">
                                    <li><i class="fa fa-user"></i>jessica alex</li>
                                    <li><i class="fa fa-clock-o"></i>25 dec, 2016</li>
                                    <li><i class="fa fa-thumbs-o-up"></i>20</li>
                                </ul>
                            </div>
                            <!-- post detail -->

                        </div>
                        <!-- post -->

                         <!-- post -->
                        <div class="post style-1">

                            <!-- post img -->
                            <div class="post-thumb"> 
                                <img src="images/post-1/img-05.jpg" alt="">
                                <span class="post-badge">post</span>
                                <div class="thumb-hover">
                                    <div class="position-center-center">
                                        <a href="#" class="fa fa-link"></a>
                                    </div>
                                </div>
                            </div>
                            <!-- post img -->

                            <!-- post detail -->
                            <div class="post-content">
                                <h4><a href="post-detail.html">Full Responsive amazing design And Pixel Perfect </a></h4>
                                <ul class="post-meta m-0">
                                    <li><i class="fa fa-user"></i>jessica alex</li>
                                    <li><i class="fa fa-clock-o"></i>25 dec, 2016</li>
                                    <li><i class="fa fa-thumbs-o-up"></i>20</li>
                                </ul>
                            </div>
                            <!-- post detail -->

                        </div>
                        <!-- post -->

                        </div>
                    </div>
                    <!-- post slider -->

                </div>
                <!-- Slider Widget -->
                        </div>
                    </div>

                    <!-- Sidebar -->
                    <div class="col-md-3 col-sm-4">
                        <aside class="side-bar">

                            <!-- Social Networks -->
                            <div class="widget">
                                <ul class="aside-social">
                                    <li class="fb">
                                        <a href="#"><i class="fa fa-facebook"></i><span>followers</span><em>100</em></a>
                                    </li>
                                    <li class="pi">
                                        <a href="#"><i class="fa fa-pinterest-p"></i><span>followers</span><em>100</em></a>
                                    </li>
                                    <li class="tw">
                                        <a href="#"><i class="fa fa-twitter"></i><span>followers</span><em>100</em></a>
                                    </li>
                                    <li class="gmail">
                                        <a href="#"><i class="fa fa-google-plus"></i><span>followers</span><em>100</em></a>
                                    </li>
                                     <li class="sky">
                                        <a href="#"><i class="fa fa-skype"></i><span>followers</span><em>100</em></a>
                                    </li>
                                    <li class="yt">
                                        <a href="#"><i class="fa fa-youtube"></i><span>followers</span><em>100</em></a>
                                    </li>
                                </ul>
                            </div>
                            <!-- Social Networks -->

                            <div class="widget">
                                <h3 class="secondry-heading">sports news</h3>
                                <div class="horizontal-tabs-widget">

                                    <!-- tabs navs -->
                                    <ul class="theme-tab-navs style-2">
                                        <li class="active">
                                            <a href="#fixtures" data-toggle="tab">Last Match</a>
                                        </li>
                                        <li>
                                            <a href="#result" data-toggle="tab">upcomming</a>
                                        </li>
                                    </ul>
                                    <!-- tabs navs -->
      
                                    <!-- Tab panes -->
                                    <div class="horizontal-tab-content tab-content">
                                        <div class="tab-pane fade active in" id="fixtures">
                                            <div class="matches-detail">
                                                <p>49 Chapel Lane ARNE BH20 12/02/2016 / 19:00</p>
                                                <div class="team-btw-match">
                                                    <ul>
                                                        <li>
                                                            <img src="images/team-logos/img-03.png" alt="">
                                                            <span>Munchester<span>United</span></span>
                                                        </li>
                                                        <li>
                                                            <img src="images/team-logos/img-04.png" alt="">
                                                            <span>Norwich<span>City</span></span>
                                                        </li>
                                                    </ul>
                                                </div>
                                                <div class="goals-detail">
                                                    <ul>
                                                        <li>
                                                            <span>M. Johansen</span>
                                                            <span>23 (FNA)</span>
                                                        </li>
                                                        <li>
                                                            <span>G. Smith</span>
                                                            <span>41 (FNA)</span>
                                                        </li>
                                                        <li>
                                                            <span>T. Mosler</span>
                                                            <span>59 (FNA)</span>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="result">
                                            <div class="upcoming-fixture">
                                            <div class="table-responsive">
                                                <table class="table m-0">
                                                    <tbody>
                                                        <tr>
                                                            <td>
                                                                <div class="logo-width-name"><img src="images/team-logos-small/img-01.png" alt="">South</div>
                                                            </td>
                                                            <td><span class="upcoming-fixture-date">6 Feb 2016 15:00</span></td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <div class="logo-width-name"><img src="images/team-logos-small/img-03.png" alt="">South</div>
                                                            </td>
                                                            <td><span class="upcoming-fixture-date">6 Feb 2016 15:00</span></td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <div class="logo-width-name"><img src="images/team-logos-small/img-05.png" alt="">South</div>
                                                            </td>
                                                            <td><span class="upcoming-fixture-date">6 Feb 2016 15:00</span></td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <div class="logo-width-name"><img src="images/team-logos-small/img-07.png" alt="">South</div>
                                                            </td>
                                                            <td><span class="upcoming-fixture-date">6 Feb 2016 15:00</span></td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                        </div>
                                    </div>
                                    <!-- Tab panes -->

                                </div>
                            </div>

                            <!-- Slider Widget -->
                            <div class="widget">
                                <h3 class="secondry-heading">slider widget</h3>
                                <div class="slider-widget">

                                    <!-- Slider -->
                                    <div id="post-slider">
                                        <div class="item">
                                            <img src="images/sidebar/slider-01.jpg" alt="slider">
                                        </div>
                                        <div class="item">
                                            <img src="images/sidebar/slider-01.jpg" alt="slider">
                                        </div>
                                        <div class="item">
                                            <img src="images/sidebar/slider-01.jpg" alt="slider">
                                        </div>
                                    </div>
                                    <!-- Slider -->

                                    <!-- Content -->
                                    <div class="post-content">
                                        <h4><a href="#">Girl yoyo Music listing with dj.</a></h4>

                                        <!-- post meta -->
                                        <ul class="post-meta">
                                            <li><i class="icon-user"></i>jessica alex</li>
                                            <li><i class="icon-clock"></i>5 minutes ago</li>
                                            <li><i class="fa fa-thumbs-o-up"></i>20</li>
                                        </ul>
                                        <!-- post meta -->

                                        <p>Lorem ipsum dolor siting amet consec adipisicing elit, sed do eiusmod.</p>
                                    </div>
                                    <!-- Content -->

                                </div>
                            </div>
                            <!-- Slider Widget -->

                            <!-- Catogires widget -->
                            <div class="widget">
                                <h3 class="secondry-heading">categories</h3>
                                <ul class="categories-widget">
                                    <li><a href="#"><em>fashion</em><span class="bg-green">15</span></a></li>
                                    <li><a href="#"><em>world</em><span class="bg-masterd">15</span></a></li>
                                    <li><a href="#"><em>technology</em><span class="bg-p-green">15</span></a></li>
                                    <li><a href="#"><em>health</em><span class="bg-orange">15</span></a></li>
                                    <li><a href="#"><em>lifestyle</em><span class="bg-gray">15</span></a></li>
                                    <li><a href="#"><em>sports</em><span class="bg-masterd">15</span></a></li>
                                  
                                </ul>
                            </div>
                            <!-- Catogires widget -->

                        </aside>
                    </div>
                    <!-- Sidebar -->

                </div>
            </div>
            <!-- Content -->
        </div>       
    </main>
    <!-- main content -->

    <!-- Footer Starts -->
    <footer class="footer">

        <!-- Footer Columns -->
        <div class="footer-columns">
            <div class="container">
                <div class="row position-r theme-padding">
                     
                    <!-- widget -->
                    <div class="col-lg-3 col-sm-3 col-xs-6 r-full-width">
                        <!-- Contact widget -->
                        <div class="footer-widget">
                            <div class="contact-list">

                                <!-- Logo Holder -->
                                <a href="index.html" class="inner-logo-2"></a>
                                <!-- Logo Holder -->

                                <ul>
                                    <li><i class="fa fa-map-marker"></i>1600 Elizabeth St, Melbournenis</li>
                                    <li><i class="fa fa-headphones"></i>( +98 ) 88-11-22-888</li>
                                    <li><i class="fa fa-envelope-o"></i>info@crizalpress.com</li>
                                    <li><i class="fa fa-skype"></i>Skype  +1 33-476-927</li>
                                    <li><i class="fa fa-globe"></i>www.crizalpress.com</li>
                                </ul>
                            </div>
                        </div>
                        <!-- Contact widget -->
                    
                    </div>
                    <!-- widget -->

                    <!-- widget -->
                    <div class="col-lg-3 col-sm-3 col-xs-6 r-full-width">
                        <!-- populer post  -->
                        <div class="footer-widget">
                            <h3>recent post</h3>
                            <div class="recent-post-widget">
                                <ul>
                                    <li>
                                        <!-- blog post -->
                                        <div class="post-wrap small-post">
                                            <!-- blog img -->
                                            <div class="post-thumb">
                                                <img src="images/flicker-imgs/img-04.jpg" alt="post">
                                            </div>
                                            <!-- blog img -->

                                            <!-- post detail -->
                                            <div class="post-content">
                                                <h5><a href="#">Luxury Travels Alternative</a></h5>
                                                <!-- post meta -->
                                                <ul class="post-meta">
                                                    <li><i class="icon-clock"></i>25 dec, 2016</li>
                                                    <li><i class="icon-speech-bubble"></i>20</li>
                                                </ul>
                                                <!-- post meta -->
                                            </div>
                                            <!-- post detail -->
                                        </div>
                                        <!-- blog post -->
                                    </li>

                                    <li>
                                        <!-- blog post -->
                                        <div class="post-wrap small-post">
                                            <!-- blog img -->
                                            <div class="post-thumb">
                                                <img src="images/flicker-imgs/img-05.jpg" alt="post">
                                            </div>
                                            <!-- blog img -->

                                            <!-- post detail -->
                                            <div class="post-content">
                                                <h5><a href="#">Luxury Travels Alternative</a></h5>
                                                <!-- post meta -->
                                                <ul class="post-meta">
                                                    <li><i class="icon-clock"></i>25 dec, 2016</li>
                                                    <li><i class="icon-speech-bubble"></i>20</li>
                                                </ul>
                                                <!-- post meta -->
                                            </div>
                                            <!-- post detail -->
                                        </div>
                                        <!-- blog post -->
                                    </li>

                                    <li>
                                        <!-- blog post -->
                                        <div class="post-wrap small-post">
                                            <!-- blog img -->
                                            <div class="post-thumb">
                                                <img src="images/flicker-imgs/img-09.jpg" alt="post">
                                            </div>
                                            <!-- blog img -->

                                            <!-- post detail -->
                                            <div class="post-content">
                                                <h5><a href="#">Luxury Travels Alternative</a></h5>
                                                <!-- post meta -->
                                                <ul class="post-meta">
                                                    <li><i class="icon-clock"></i>25 dec, 2016</li>
                                                    <li><i class="icon-speech-bubble"></i>20</li>
                                                </ul>
                                                <!-- post meta -->
                                            </div>
                                            <!-- post detail -->
                                        </div>
                                        <!-- blog post -->
                                    </li>

                                    <li>
                                        <!-- blog post -->
                                        <div class="post-wrap small-post">
                                            <!-- blog img -->
                                            <div class="post-thumb">
                                                <img src="images/flicker-imgs/img-06.jpg" alt="post">
                                            </div>
                                            <!-- blog img -->

                                            <!-- post detail -->
                                            <div class="post-content">
                                                <h5><a href="#">Luxury Travels Alternative</a></h5>
                                                <!-- post meta -->
                                                <ul class="post-meta">
                                                    <li><i class="icon-clock"></i>25 dec, 2016</li>
                                                    <li><i class="icon-speech-bubble"></i>20</li>
                                                </ul>
                                                <!-- post meta -->
                                            </div>
                                            <!-- post detail -->
                                        </div>
                                        <!-- blog post -->
                                    </li>
                                </ul>
                                
                            </div>
                        </div>
                        <!-- populer post  -->
                    </div>
                    <!-- widget -->
                   
                    <!-- widget -->
                    <div class="col-lg-3 col-sm-3 col-xs-6 r-full-width">
                        <!-- quick links -->
                        <div class="footer-widget mb-30">
                            <h3>quick links</h3>
                            <div class="quick-links">
                                <ul>
                                    <li><a href="#">Criminal or other Practice</a></li>
                                    <li><a href="#">united kingdom news</a></li>
                                    <li><a href="#">Government Announced</a></li>
                                    <li><a href="#">New technology</a></li>
                                </ul>
                            </div>
                        </div>
                        <!-- quick links -->

                         <!-- populer tags -->
                        <div class="footer-widget">
                            <h3 class="mb-20">populer tags</h3>
                            <div class="populer-tags">
                                <ul>
                                    <li><a href="#">html5</a></li>
                                    <li><a href="#">bootstrap</a></li>
                                    <li><a href="#">css3</a></li>
                                    <li><a href="#">technology</a></li>
                                    <li><a href="#">devolopment</a></li>
                                    <li><a href="#">bootstrap</a></li>
                                    <li><a href="#">jquery</a></li>
                                </ul>
                            </div>
                        </div>
                        <!-- populer tags -->
                    </div>
                    <!-- widget -->

                     <!-- widget -->
                    <div class="col-lg-3 col-sm-3 col-xs-6 r-full-width">

                        <!-- Contact widget -->
                        <div class="footer-widget mb-30">
                            <h3>flicker widget</h3>
                            <div class="flicker-imgs-list">
                                <ul>
                                    <li><a href="images/flicker-imgs/img-01.jpg" data-rel='prettyPhoto'><img src="images/flicker-imgs/img-01.jpg" alt=""></a></li>
                                    <li><a href="images/flicker-imgs/img-02.jpg" data-rel='prettyPhoto'><img src="images/flicker-imgs/img-02.jpg" alt=""></a></li>
                                    <li><a href="images/flicker-imgs/img-03.jpg" data-rel='prettyPhoto'><img src="images/flicker-imgs/img-01.jpg" alt=""></a></li>
                                    <li><a href="images/flicker-imgs/img-04.jpg" data-rel='prettyPhoto'><img src="images/flicker-imgs/img-04.jpg" alt=""></a></li>
                                    <li><a href="images/flicker-imgs/img-05.jpg" data-rel='prettyPhoto'><img src="images/flicker-imgs/img-05.jpg" alt=""></a></li>
                                    <li><a href="images/flicker-imgs/img-06.jpg" data-rel='prettyPhoto'><img src="images/flicker-imgs/img-06.jpg" alt=""></a></li>
                                    <li><a href="images/flicker-imgs/img-07.jpg" data-rel='prettyPhoto'><img src="images/flicker-imgs/img-07.jpg" alt=""></a></li>
                                    <li><a href="images/flicker-imgs/img-08.jpg" data-rel='prettyPhoto'><img src="images/flicker-imgs/img-08.jpg" alt=""></a></li>
                                    
                                </ul>
                            </div>
                        </div>
                        <!-- Contact widget -->

                        <!-- Newsletter widget -->
                        <div class="footer-widget">
                            <h3 class="mb-15">newsletter</h3>
                            <div class="newsletter-form">
                                <p>Enter your email here</p>
                                <form>
                                    <div class="input-group">
                                        <span class="input-group-addon"><i class="fa fa-envelope-o"></i></span>
                                        <input type="text" class="form-control" placeholder="Your Email">
                                        <span class="input-group-btn">
                                          <button type="submit" class="btn btn-icon">
                                            <i class="fa fa-paper-plane"></i></button> 
                                        </span>
                                    </div>
                                </form>
                            </div>
                        </div>
                        <!-- Newsletter widget -->

                    </div>
                    <!-- widget -->

                    <!-- back To Button -->
                    <span id="scrollup" class="scrollup"><i class="fa fa-angle-up"></i></span>
                    <!-- back To Button -->
                    
                </div>
            </div>
        </div>
        <!-- Footer Columns -->

        <!-- Copyright Bar -->
        <div class="sub-footer">
            <div class="container">
                <div class="copyright-bar">
                    <p>crizal press <i class="fa fa-copyright"></i> 2015, All Rights Reserved</p>
                    <ul>
                         <li><a href="#">home</a></li>
                         <li><a href="#">about</a></li>
                         <li><a href="#">blog</a></li>
                         <li><a href="#">contact us</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- Copyright Bar -->

        <!-- contact popup -->
        <div class="footer-contact-popup">
            <div class="popup-wrap">
                <a href="#" id="popup-btn"><i class="fa fa-envelope-o"></i></a> 
                <div class="contact-holder">
                    <h4>Send us a message</h4>
                    <div class="contact-form">
                        <form>
                            <div class="form-group">
                                <input type="text" placeholder="Your Name" class="form-control">
                            </div>
                            <div class="form-group">
                                <input type="email" placeholder="Your Email" class="form-control">
                            </div>
                            <div class="form-group">
                                <textarea class="form-control" placeholder="Message" rows="3"></textarea>
                            </div>
                            <a href="#" class="btn red full-width"><span>Send</span></a>
                        </form>
                    </div>
                </div>
            </div>
        </div>
         <!-- contact popup -->

    </footer>
    <!-- Footer Starts -->

</div>
<!-- Wrapper -->

<!-- Slide Menu -->
<div id="menu" class="res-menu" role="navigation">
    <div class="res-menu-holder">
        <!-- logo -->
        <div class="logo-holder">
            <a href="index.html" class="inner-logo"></a>
        </div>
        <!-- logo -->

        <!-- menu -->
        <ul class="res-nav">
            <li>
                <a data-toggle="collapse" href="#list-1"><i class="fa fa-angle-down pull-right"></i>Home</a>
                <ul class="collapse sub-list" id="list-1">
                    <li><a href="index.html">Version 1</a></li>
                    <li><a href="index-2.html">Version 2</a></li>
                    <li><a href="index-3.html">version 3</a></li> 
                </ul>
            </li>
            <li>
                <a data-toggle="collapse" href="#list-2"><i class="fa fa-angle-down pull-right"></i>categories</a>
                <ul class="collapse sub-list" id="list-2">
                       <li><a href="listing-page-1.html">fashion</a></li> 
					   <li><a href="listing-page-2.html">sports</a></li> 
					   <li><a href="listing-page-3.html">world</a></li> 
					   <li><a href="listing-page-4.html">lifestyle</a></li> 
					   <li><a href="listing-page-5.html">technology</a></li> 
					   <li><a href="listing-page-6.html">health</a></li> 
					   <li><a href="listing-page-7.html">MISC</a></li> 
                </ul>
            </li>
            <li>
                <a data-toggle="collapse" href="#list-3"><i class="fa fa-angle-down pull-right"></i>post</a>
                <ul class="collapse sub-list" id="list-3">
                    <li><a href="slider-post.html">slider post</a></li>
                    <li><a href="video-post.html">video post</a></li>
                    <li><a href="post-detail.html">blog detail</a></li>
                    <li><a href="post-detail-full-width.html">blog detail full width</a></li>
                </ul>
            </li>
            <li>
                <a data-toggle="collapse" href="#list-4"><i class="fa fa-angle-down pull-right"></i>shop</a>
                <ul class="collapse sub-list" id="list-4">
                    <li><a href="products.html">product </a></li>
                    <li><a href="products-detail.html">product detail</a></li>
                </ul>
            </li>
            <li>
                <a data-toggle="collapse" href="#list-5"><i class="fa fa-angle-down pull-right"></i>contact</a>
                <ul class="collapse sub-list" id="list-5">
                    <li><a href="contact.html">contact</a></li>
                    <li><a href="contact-2.html">contact 2</a></li>
                    <li><a href="contact-3.html">contact 3</a></li>
                </ul>
            </li>
            <li>
                <a data-toggle="collapse" href="#list-6"><i class="fa fa-angle-down pull-right"></i>404</a>
                <ul class="collapse sub-list" id="list-6">
                    <li><a href="error-404-1.html">error 1</a></li>
                    <li><a href="error-404-2.html">error 2</a></li>
                </ul>
            </li>
            <li>
                <a data-toggle="collapse" href="#list-7"><i class="fa fa-angle-down pull-right"></i>pages</a>
                <ul class="collapse sub-list" id="list-7">
                    <li><a href="faq.html">faq</a></li>
                    <li><a href="comming-soon.html">comming soon</a></li>
                </ul>
            </li>
        </ul>
        <!-- menu -->

        <!-- social icons -->
        <ul class="social-style-2">
            <li class="fb"><a href="#" class="fa fa-facebook"></a></li>
            <li class="tw"><a href="#" class="fa fa-twitter"></a></li>
            <li class="pi"><a href="#" class="fa fa-pinterest-p"></a></li>
            <li class="li"><a href="#" class="fa fa-linkedin"></a></li>
            <li class="sky"><a href="#" class="fa fa fa-skype"></a></li>
        </ul>
        <!-- social icons -->

        <!-- copyright -->
        <p><i class="fa fa-copyright"></i> All right reserved by <a href="#">Crizalpress</a> <i class="fa fa-heart"></i></p>
        <!-- copyright -->
    </div>
</div>
<!-- Slide Menu -->

<!-- register model -->
<div class="md-modal md-effect-1 login-modal font-oswald" id="register-popup">
    <div class="md-content">

        <!-- login socila buttons -->
        <ul class="login-social">
            <li class="fb"><a href="#"><i class="fa fa-facebook"></i>login with facebook</a></li>
            <li class="gmail"><a href="#"><i class="fa fa-google-plus" ></i>login with goolge+</a></li>
        </ul>
        <!-- login socila buttons -->

        <!-- or -->
        <span class="or-seprator">or</span>
        <!-- or -->

        <!-- sign up form -->
        <form class="signup-form">
            <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-user"></i></span>
                <input type="text" class="form-control" placeholder="First name*">
            </div>
            <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-user"></i></span>
                <input type="text" class="form-control" placeholder="Last name">
            </div>
            <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-envelope-o"></i></span>
                <input type="text" class="form-control" placeholder="Your Email*">
            </div>
            <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-lock"></i></span>
                <input type="text" class="form-control" placeholder="Password">
            </div>
             <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-lock"></i></span>
                <input type="text" class="form-control" placeholder="confirm password">
            </div>
            <div class="form-group">
                <a href="#" class="btn full-width green">get started</a>
            </div>
            <p>Already a member ? <a href="#" class="text-red">Login</a></p>
        </form>
        <!-- sign up form -->
        <a class="md-close pull-right" href="#"></a>
    </div>
</div>
<!-- register model -->

<!-- login model -->
<div class="md-modal md-effect-1 login-modal font-oswald" id="login-popup">
    <div class="md-content">

        <!-- login socila buttons -->
        <ul class="login-social">
            <li class="fb"><a href="#"><i class="fa fa-facebook"></i>login with facebook</a></li>
            <li class="gmail"><a href="#"><i class="fa fa-google-plus" ></i>login with goolge+</a></li>
        </ul>
        <!-- login socila buttons -->

        <!-- or -->
        <span class="or-seprator">or</span>
        <!-- or -->
        
        <!-- serach form -->
        <form class="login-form">
            <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-envelope-o"></i></span>
                <input type="text" class="form-control" placeholder="Enter your email">
            </div>
            <div class="input-group">
                <span class="input-group-addon"><i class="fa fa-lock"></i></span>
                <input type="password" class="form-control" placeholder="*********">
            </div>
            <div class="form-group">
                <a href="#" class="btn full-width green">login</a>
            </div>
            <div class="form-group">
                <a href="#" class="forgot-password pull-right">Forgot password?</a>
                <div class="checkbox checkbox-inline">
                    <label>
                        <input type="checkbox"> Remember me
                    </label>
                </div>
            </div>
            <p>Don't have a account ? <a href="#" class="text-red">Sign up</a></p>

            <a class="md-close pull-right" href="#"></a>
        </form>
        <!-- serach form -->

    </div>
</div>
<!-- login model -->

<!-- serach modal -->
<div class="md-modal md-effect-7 search-modal font-oswald" id="search-popup">
    <div class="md-content">
        <!-- serach form -->
        <form class="search-form">
            <input class="form-control" placeholder="Type &amp; hit enter" type="text">
        </form>
        <a class="md-close pull-right fa fa-times" href="#"></a>
        <!-- serach form -->
    </div>
</div>
<!-- serach modal -->

<!-- overlay -->
<div class="md-overlay"></div>
<!-- overlay -->

<!-- Switcher  Panel -->
<div class="switcher"></div>  
<!-- Switcher Panel -->

<!-- Java Script -->
<script src="js/vendor/jquery.js"></script>        
<script src="js/vendor/bootstrap.min.js"></script>  
<script src="http://ditu.google.cn/maps/api/js?sensor=false"></script>
<script src="js/gmap3.min.js"></script>              
<script src="js/parallax.js"></script>               
<script src="js/datepicker.js"></script>                 
<script src="js/ninja-slider.js"></script>                 
<script src="js/thumbnail-slider.js"></script>                 
<script src="js/countdown.js"></script> 
<script src="js/modal.js"></script>                 
<script src="js/classie.js"></script>                   
<script src="js/big-slide.js"></script> 
<script src="js/owl-carousel.js"></script>  
<script src="js/scrollbar.js"></script> 
<script src="js/prettyPhoto.js"></script>  
<script src="js/contact-form.js"></script>           
<script src="js/bxslider.js"></script>           
<script src="js/isotope.pkgd.js"></script>           
<script src="js/main.js"></script>                        

<!-- Switcher JS -->
<script type="text/javascript" src="switcher/cookie.js"></script>
<script type="text/javascript" src="switcher/colorswitcher.js"></script>
<!-- Switcher JS -->  
					
</body>
</html>